<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/mstyle.css" />
		<style>
			.chart {
				width:100%;
				height:260px;
				margin: 0px;
				padding: 0px;
			}
			@media screen and (max-width:320px){
			    .chart {
					width:100%;
					height:200px;
					margin: 0px;
					padding: 0px;
				}
			}	
		</style>
	</head>
	<body class="stockInfo optionalPage">
		<!--navBar-->
		<header class="mui-bar mui-bar-nav">
			<a class="mui-icon mui-action-back mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title"></h1>
		</header>
		<div class="curPrice mui-content ">
			<h1 class="priceCur"></h1>
			<p><span class="changeCur"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="changeRateCur"></span></p>
		</div>
		<div class="slide-content-stock">
			<div id="slider" class="mui-slider mui-fullscreen">
				<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
					<div class="mui-scroll tabState">
						<a class="mui-control-item mui-active" href="#item1mobile" data-wid="stockInfoDay.html" data-state='minute'>
							分时
						</a>
						<a class="mui-control-item" href="#item2mobile" data-wid="stockInfoDay.html" data-state='day'>
							日线
						</a>
						<a class="mui-control-item" href="#item3mobile" data-wid="stockInfoDay.html" data-state='week'>
							周线
						</a>
						<a class="mui-control-item" href="#item4mobile" data-wid="stockInfoDay.html" data-state='month'>
							月线
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="chart" id="barChart"></div>
		<div class="dataSign mui-row">
			<div class="mui-col-sm-4 mui-col-xs-4"><p><span class="name">最  高</span>&nbsp;&nbsp;<span class="highCur numS"></span></p></div>
			<div class="mui-col-sm-4 mui-col-xs-4"><p><span class="name">今  开</span>&nbsp;&nbsp;<span class="openCur numS"></span></p></div>
			<div class="mui-col-sm-4 mui-col-xs-4"><p><span class="name">成交量</span>&nbsp;&nbsp;<span class="volumeCur numS"></span></p></div>
			<div class="mui-col-sm-4 mui-col-xs-4"><p><span class="name">最  低</span>&nbsp;&nbsp;<span class="lowCur numS"></span></p></div>
			<div class="mui-col-sm-4 mui-col-xs-4"><p><span class="name">昨  收</span>&nbsp;&nbsp;<span class="closeCur numS"></span></p></div>
		</div>
		<!--tabBar-->
		<nav class="bottom_bar mui-bar mui-bar-tab">
			<a class="getS mui-tab-item mui-clearfix" href="javascript:void(0)">
				<img src="images/MR_17x17_@3x.png" alt="" />
				<span>买入</span>
			</a>
			<a class="saleS mui-tab-item mui-active  mui-clearfix" href="javascript:void(0)">
				<img src="images/MC_17x17_@3x.png" alt="" />
				<span>卖出</span>
			</a>
			<a class="optSel mui-tab-item mui-clearfix " href="javascript:void(0)">
				<img src="images/Collect_MR_icon_17x17_@3x.png" alt="" />
				<span>自选</span>
			</a>
		</nav>
		<script src="js/mui.min.js"></script>
		<script src='js/webviewGroup.js'></script>
		<script src='libs/easymob-webim-sdk/jquery-1.11.1.js'></script>
		<script src='js/config.js'></script>
		<script src='js/mstock.js'></script>
		<script src="libs/echarts.min.js"></script>
		<script type="text/javascript"> 
			mui.init();
			var href = location.href;
			var codeType;
			mui.ready(function(){
				var code = href.split("?code=")[1];
				jQuery.ajax({
					type:'post',
					url:server.stockOne,
					data:{
						app:'app',
						action:"oneStockInfo",
						stockCode:code
					},
					dataType:'json',
					success:function(result){
						console.log(result)
						if(result.code==1){
							 mui.toast(result.msg); 
						}else {
							dataShow(result.data);
							setInterval(infoEve,2000);
						}
					},
					error:function(xhr,type,errorThrown){
						//异常处理；
						console.log(type);
					}
				})
				function infoEve(){
					var data =	{
							app:'app',
							action:"oneStockInfo",
							stockCode:code
					}
					jQuery.ajax({
						type:'post',
						url:server.stockOne,
						data:{
							app:'app',
							action:"oneStockInfo",
							stockCode:code
						},
						dataType:'json',
						success:function(result){
							if(result.code==1){
								// mui.toast(result.msg); 
							}else {
								var data  = result.data
								if(Number(data[0].changeRate) >= 0){
									jQuery('.curPrice').addClass('redNum').removeClass('greenNum');
								}else{
									jQuery('.curPrice').addClass('greenNum').removeClass('redNum');
								}
								jQuery('.mui-title').html(data[0].name+'('+data[0].code+')');
								jQuery('.priceCur').html(data[0].price);
								jQuery('.changeCur').html(data[0].change);
								jQuery('.changeRateCur').html(data[0].changeRate+'%');
								jQuery('.highCur').html(data[0].high);
								jQuery('.openCur').html(data[0].openPrice);
								jQuery('.lowCur').html(data[0].low);
								jQuery('.closeCur').html(data[0].closePrice);
								if(Number(data[0].volume)>100000){
									data[0].volume = (Number(data[0].volume)/10000).toFixed(0)+'万';
								}
								jQuery('.volumeCur').html(data[0].volume);
							}
						},
						error:function(xhr,type,errorThrown){
							//异常处理；
							console.log(type);
						}
					})
				}
				function dataShow(data){
					if(account&&account!=''){
						ajaxEve(server.optSel,{app:'app',action:"optionalYN",stockCode:code,account:account},function(result){
							if(result.data.optional=='Y'){
								jQuery('.optSel').addClass('optSelAct');
								jQuery('.optSel img').attr('src','images/Collect_CF_icon-0_17x17_@3x.png');
							}
						})
					}
					if(Number(data[0].changeRate) >= 0){
						jQuery('.curPrice').addClass('redNum').removeClass('greenNum');
					}else{
						jQuery('.curPrice').addClass('greenNum').removeClass('redNum');
					}
					jQuery('.mui-title').html(data[0].name+'('+data[0].code+')');
					jQuery('.priceCur').html(data[0].price);
					jQuery('.changeCur').html(data[0].change);
					jQuery('.changeRateCur').html(data[0].changeRate+'%');
					jQuery('.highCur').html(data[0].high);
					jQuery('.openCur').html(data[0].openPrice);
					if(Number(data[0].volume)>100000){
						data[0].volume = (Number(data[0].volume)/10000).toFixed(0)+'万';
					}
					jQuery('.volumeCur').html(data[0].volume);
					jQuery('.lowCur').html(data[0].low);
					jQuery('.closeCur').html(data[0].closePrice);	
					var codeType = data[0].type;
					mstcok().stockInfo(code,codeType);
				}
				//自选
				mui('.bottom_bar').on('tap','.optSel',function(){
					var ths = jQuery(this);
					if(ths.hasClass('optSelAct')){
						mui.toast('请勿重复添加');
						return;
					}
					if(account&&account!=''){
						maskShowEvent();
						jQuery.ajax({
							type:'post',
							url:server.optSel,
							data:{
								app:'app',
								action:"optionalAdd",
								stockCode:code,
								account:account
							},
							dataType:'json',
							success:function(result){
								maskHideEvent();
								console.log(result);
								if(result.code==1){
									 mui.toast(result.msg); 
								}else {
									mui.toast(result.msg); 
									jQuery('.optSel').addClass('optSelAct');
									jQuery('.optSel img').attr('src','images/Collect_CF_icon-0_17x17_@3x.png');
								}
							},
							error:function(xhr,type,errorThrown){
								//异常处理；
								maskHideEvent()
								console.log(type);
							}
						})
					}else{
						mui.openWindow({
							url:'login.html',
							id:'login.html'
						})
						return;
					}
					
				})
				//买入
				mui('.bottom_bar').on('tap','.getS',function(){
					if(account&&account!=''){
						mui.openWindow({
							url: 'stockDeal.html?code='+code,
							id:'stockDeal.html'
						});
					}else{
						mui.openWindow({
							url: 'login.html',
							id:'login.html'
						});
					}
					
				})
				//卖出
				mui('.bottom_bar').on('tap','.saleS',function(){
					if(account&&account!=''){
						mui.openWindow({
							url: 'stockDeal.html?code='+code,
							id:'stockDeal.html'
						});
					}else{
						mui.openWindow({
							url: 'login.html',
							id:'login.html'
						});
					}
					
				})
			})
		</script>
	</body>
</html>